.home-container {
  display: grid;
  grid-template-columns: 0.7fr 0.9fr 1.5fr 0.9fr;
  grid-template-rows: 2.75rem 3fr;
  grid-template-areas:
    "nav nav nav nav"
    "sidebar leftmenu content rightmenu";
  gap: 0.75rem 0.4rem;
}

.navigation {
  grid-area: nav;
}

.sidebar {
  min-height: var(--min-screen-height);
  grid-area: sidebar;
  background-color: aliceblue;
  border-top: var(--border);
  border-right: var(--border);
}

.leftmenu {
  grid-area: leftmenu;
}

.content {
  min-height: var(--min-screen-height);
  grid-area: content;
  padding: 0.5em 0.75em 0.5em 0.75em;
}

.rightmenu {
  grid-area: rightmenu;
}

@media screen and (orientation: portrait) and (max-width: 768px) {
  .home-container {
    grid-template-columns: 1fr;
    grid-template-areas:
      "nav"
      "content";
  }
}
